import React, { memo } from 'react';
import { Card } from 'antd';
import cn from 'classnames';
import styles from '@/pages/OnboardAndLeave/LeaveManagement/Talk/Conclusion/index.less';
import QuestionList from './QuestionList';

const TalkQuestionResult = ({ data = {} }) => {
    const { interviewQuestionVOList = [] } = data;
    return interviewQuestionVOList.map((x, index) => (
        <Card
            title={
                <div style={{ lineHeight: '24px' }}>
                    {`${index + 1}.`}
                    <span>{`${x.question}`}</span>
                    <span
                        style={{
                            display: 'inline-flex',
                            color: 'rgba(0,0,0,0.15)',
                            fontSize: 14
                        }}
                    >
                        <i className={cn('iconfont', 'iconcountpeople_o', styles.createUserIcon)}/>
                        <span style={{ color: 'rgba(0,0,0,0.65)', fontSize: 14 }}>
                            {x?.createUserInfo?.employeeName}
                        </span>
                    </span>
                </div>
            }
            headStyle={{ background: '#fafafa', border: 'none' }}
            style={{ marginBottom: '10px', width: '725px', borderColor: '#E8E8E8' }}
            className={styles.questionCard}
            key={x.id}
        >
            <QuestionList data={{
                questionData: x,
                interviewArrangeVO: data.interviewArrangeVO
            }} />
        </Card>
    ))
}
export default memo(TalkQuestionResult)
